import type {FormItemRule} from 'element-plus'

// 表单字段选项接口
export interface FormFieldOption {
  label: string
  value: any
  disabled?: boolean
}

// 表格按钮配置接口
export interface TableButton {
  type: string
  text: string
  icon?: string
  disabled?: boolean
  visible?: boolean
  onClick?: (tableData: Record<string, any>[], field: string) => void
}

// 表格列配置接口
export interface TableColumn {
  prop: string
  label: string
  type: 'input' | 'select' | 'number' | 'date' | 'switch'
  width?: string | number
  options?: FormFieldOption[]
  required?: boolean
  placeholder?: string
  min?: number
  max?: number
  // switch相关
  activeText?: string
  inactiveText?: string
  activeValue?: any
  inactiveValue?: any
}

// 表单字段配置接口
export interface FormField {
  // 基础属性
  prop: string
  label: string
  type: 'input' | 'password' | 'number' | 'select' | 'radio' | 'checkbox' | 'date' | 'datetime' | 'textarea' | 'switch' | 'slot' | 'table'
  
  // 通用属性
  required?: boolean
  disabled?: boolean
  placeholder?: string
  defaultValue?: any
  rules?: FormItemRule[]
  requiredMessage?: string
  
  // 事件回调
  onChange?: (value: any, formData: Record<string, any>) => void
  onBlur?: (value: any, formData: Record<string, any>) => void
  onFocus?: (value: any, formData: Record<string, any>) => void
  
  // 输入框相关
  maxlength?: number
  showWordLimit?: boolean
  clearable?: boolean
  
  // 密码框相关
  showPassword?: boolean
  
  // 数字输入框相关
  min?: number
  max?: number
  step?: number
  precision?: number
  
  // 选择框相关
  options?: FormFieldOption[]
  multiple?: boolean
  
  // 日期相关
  format?: string
  valueFormat?: string
  
  // 文本域相关
  rows?: number
  autosize?: boolean | { minRows?: number; maxRows?: number }
  
  // 开关相关
  activeText?: string
  inactiveText?: string
  activeValue?: any
  inactiveValue?: any
  
  // 自定义插槽相关
  slotName?: string
  
  // 表格相关
  columns?: TableColumn[]
  buttons?: TableButton[]
  disableDeleteFirstRow?: boolean // 是否禁用删除第一行
  showOperationColumn?: boolean // 是否显示操作列
  operationColumnLabel?: string // 操作列标题
  operationColumnWidth?: string | number // 操作列宽度
  
  // 布局相关（用于页面表单）
  colSpan?: number // 栅格占用的列数，默认根据每行列数自动计算
}

// 表单配置接口
export interface FormConfig {
  size?: string | number
  labelWidth?: string
  labelPosition?: 'left' | 'right' | 'top'
  inline?: boolean
  disabled?: boolean
}

// 表单数据接口
export interface FormData {
  [key: string]: any
}

// 表单配置
export interface PropsConfig {
  visible?: boolean
  mode?: 'drawer' | 'page'
  title?: string
  description?: string
  fields: FormField[]
  data?: Record<string, any>
  config?: FormConfig
  loading?: boolean
  submitText?: string
  cancelText?: string
  resetText?: string
  showHeader?: boolean
  showFooter?: boolean
  showCancel?: boolean
  showReset?: boolean
  columnsPerRow?: number
  gutter?: number
}

export interface Emits {
  'update:visible': [visible: boolean]
  'submit': [data: FormData]
  'cancel': []
  'field-change': [data: { field: string; value: any; rowIndex?: number; columnProp?: string; cellValue?: any }]
  'field-blur': [data: { field: string; value: any }]
  'field-focus': [data: { field: string; value: any }]
  'add-row': [data: { field: string; row: Record<string, any>; index: number }]
  'remove-row': [data: { field: string; row: Record<string, any>; index: number }]
  'add-common-field': [data: { field: string; tableData: Record<string, any>[] }]
}